<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<button id="btn">
    按钮
</button>




<br/>

<div style="width: 100px;height: 100px;background-color:red;margin-top: 30px"  id="div1">
    444
</div>
<script>

    //鼠标移动
    window.document.body.onmouseover = function (e){

        //获取移动到哪个元素上了
        let  el = e.target;

        if(el.toString()!=='[object HTMLButtonElement]'){
            console.log(el.toString())
            console.log(el.getAttribute('id'))
        }

    }


    document.getElementById('div1').onmouseleave  = function (e){
        console.log('离开div')
        document.getElementById('div1').style.display = 'none'

    }


    document.getElementById('btn').onclick = function () {
        document.getElementById('div1').style.display = 'block'
    }

</script>
</body>
</html>